<template>

    <div class="addMerchantBox" v-loading="loading" :model="data">
        <el-form ref="form" :model="data">

            <el-form-item label="手机号" prop="mobile">
                <el-input v-model="data.mobile" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="商家类型" prop="mobile">
                <el-input v-model="data.agent_type === 0 ? '厂家' : '代理'" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="代理商级别" prop="mobile">
                <el-input v-model="data.level" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="机构类型" prop="organ_type">
                <el-input v-model="data.organ_type === 1 ? '企业法人' : '个体工商户'" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="机构主体全称" prop="company">
                <el-input v-model="data.company" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="营业执照注册号" prop="license_num">
                <el-input v-model="data.license_num" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="省" prop="province">
                <el-input v-model="data.province_name" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="市" prop="city">
                <el-input v-model="data.city_name" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="区" prop="district">
                <el-input v-model="data.district_name" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="详细地址" prop="address">
                <el-input v-model="data.address" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>


            <el-form-item label="联系人姓名" prop="real_name">
                <el-input v-model="data.real_name" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="联系手机" prop="mobile">
                <el-input v-model="data.mobile" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="营业范围" prop="scope">
                <el-input
                        style="width:400px"
                        type="textarea"
                        :autosize="{ minRows: 10}"
                        readonly="readonly"
                        v-model="data.scope">
                </el-input>
            </el-form-item>

            <el-form-item label="主营类型" prop="main_type">
                <el-input v-model="data.main_type" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>


            <el-form-item label="营销执照扫描件">
                <img alt class :src="data.license_img" v-show="licenseVisible">
            </el-form-item>

            <el-form-item label="资质证书扫描件">
                <img alt class :src="data.intelligence_img" v-show="intelligenceVisible">
            </el-form-item>

            <el-form-item label="商标授权证件扫描">
                <img alt class :src="data.trademark_img" v-show="trademarkVisible">
            </el-form-item>

            <el-form-item label="银行对公账号" prop="bank_num">
                <el-input v-model="data.bank_num" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="对公账号户名" prop="bank_username">
                <el-input v-model="data.bank_username" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="对公账号开户行" prop="bank_name">
                <el-input v-model="data.bank_name" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="法人代表姓名" prop="person_name">
                <el-input v-model="data.person_name" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="法人身份证号码" prop="person_number">
                <el-input v-model="data.person_number" readonly="readonly" style="width:300px"></el-input>
            </el-form-item>

            <el-form-item label="法人身份证正面">
                <img alt class :src="data.person_id_card_z" v-show="cardZVisible">
            </el-form-item>

            <el-form-item label="法人身份证反面">
                <img alt class :src="data.person_id_card_f" v-show="cardFVisible">
            </el-form-item>

            <el-form-item label="审核说明" prop="remake" >
                <el-input
                        id="remake"
                        style="width:400px"
                        type="textarea"
                        :autosize="{ minRows: 10}"
                        placeholder="请填写审核说明"
                        v-model="data.remake">
                </el-input>
            </el-form-item>
        </el-form>



        <div class="submitBtnBox">
            <el-button v-if="buttonVisible" class="submitBtn" @click="submitClick(1,data.id)" type="primary">
                审核信息无误，通过
            </el-button>
            <el-button v-if="buttonVisible" class="submitBtn" @click="submitClick(2,data.id)" type="primary">
                审核信息不通过
            </el-button>
        </div>
        <div style="height: 80px"></div>
    </div>
</template>

<script>

    export default {
        name: 'agentApply',
        data(){
            return{
                data:{},
                levelList:[
                    {id:1,label:'省级代理'},
                    {id:2,label:'市级代理'},
                    {id:3,label:'区、县级代理'},
                    {id:4,label:'镇级代理'},
                    {id:5,label:'村级代理'},
                ],
                loading: false,
                licenseVisible: true,
                intelligenceVisible: true,
                trademarkVisible: true,
                cardZVisible: true,
                cardFVisible: true,
                buttonVisible: true
            }
        },

        methods:{

            getUserInfo(){
                this.loading = true;
                this.$http.post("/agent/mill/apply/info", {
                        token: localStorage.getItem("user_token"),
                        agent_id: this.$route.query.agent_id,
                        mill_id: this.$route.query.mill_id
                }).then(response => {
                    if (response.data.status === "success") {
                        this.data = response.data.data
                        if (response.data.data.status > 0 ){
                            this.buttonVisible = false
                            document.getElementById('remake').setAttribute("readOnly",'true');
                        }
                        for (let i = 0; i < this.levelList.length; i++){
                            if (this.data.level === this.levelList[i].id){
                                this.data.level = this.levelList[i].label
                            }
                        }
                    }
                    this.loading = false;
                })

            },

            submitClick(status,id){
                if (!this.data.remake || this.remake === ''){
                    this.$message({
                        message: '请填写审核说明',
                        type: 'warning'
                    });
                    return;
                }
                this.loading = true;
                this.$http.post("/agent/mill/apply/exam", {
                    token: localStorage.getItem("user_token"),
                    status: status,
                    id: id,
                    remake: this.data.remake
                }).then(response => {

                    if (response.data.status === 'success') {
                        this.$message({
                            message: '保存成功',
                            type: 'success',
                            duration: 6000
                        });
                        this.$router.push({name: 'checkAgent'})
                    }else{
                        this.$message({
                            showClose: true,
                            message: '保存失败，请稍候再试',
                            type: 'error'
                        });

                    }
                    this.loading = false
                }).catch(error => {
                    console.log(error);

                    this.$message({
                        showClose: true,
                        message: '保存失败，请稍候再试',
                        type: 'error'
                    });
                    this.loading = false
                });


            }
        },

        mounted() {
            this.getUserInfo();
        }
    }
</script>

<style scoped lang="scss">
    @import "./check.scss";
</style>